<template>
  <div class="detail-wrap">
    <el-dialog v-model="dialogVisible" top="2vh" :title="title" width="800px" class="one-dialog" draggable @close="emit('close')">
      <!-- <el-form :label-position="top">
        <el-row>
          <el-col :span="8">
            <el-form-item label="拉取单号">{{ ruleForm.code }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="申请人">{{ ruleForm.applyUser }}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="申请时间">{{ ruleForm.time }}</el-form-item>
          </el-col>
        </el-row>
      </el-form> -->
      <el-form label-position="top">
        <!-- <el-form-item label="能力列表"> -->
        <el-table :data="tableData" size="small">
          <el-table-column type="index" label="序号" align="center" width="80" />
          <el-table-column label="能力编码" prop="code" show-overflow-tooltip />
          <el-table-column label="能力名称" prop="name" show-overflow-tooltip />
          <el-table-column label="能力属地" prop="belong" show-overflow-tooltip />
          <el-table-column label="能力版本号" prop="tag" show-overflow-tooltip />
          <el-table-column label="操作" width="100">
            <template #default="scope">
              <el-button link type="primary" size="small">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- </el-form-item> -->
        <el-button style="margin-top: 10px" type="primary" @click="handleOff">添加能力</el-button>
        <!-- <el-form-item label="申请原因" style="margin-top: 20px">
          <el-input type="textarea"></el-input>
        </el-form-item> -->
        <el-form-item label="申请用途" class="mt-4">
          <el-input type="textarea"></el-input>
        </el-form-item>
      </el-form>
      <el-form>
        <el-form-item label="申请人"> 林正平 </el-form-item>
        <el-form-item label="申请时间"> {{ new Date().toLocaleDateString() }} </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="dialogVisible = false">取消</el-button>
          <el-button type="primary" @click="dialogVisible = false">确定</el-button>
        </span>
      </template>
    </el-dialog>
    <Off v-if="isOffDialog" @close="offclose" />
  </div>
</template>
<script lang="ts" setup>
import to from 'await-to-js'
import type { FormInstance } from 'element-plus'
import Off from './off.vue'
// import {defaultOperationList} from '@/utils/data/ability'

const isOffDialog = ref(false)
const handleOff = () => {
  isOffDialog.value = true
}
const emit = defineEmits(['close'])
const props = defineProps<{
  currentRow: any
  type: string
  abilityId: any
}>()
// onMounted(() => {
//   const router =useRouter();
//   // if(props.abilityId) {
//     // let res = defaultOperationList.find(item => item.abilityId == props.abilityId)
//     // tableData.value = [res]
//   }
// })
const title = ref('拉取配置')
const dialogVisible = ref<boolean>(true)
const ruleForm = ref({
  orgName: '重庆',
  code: '012436456499',
  time: '2020-09-01 13:44:21',
  applyUser: '张三',
  status: 0
})
const offclose = (val) => {
  isOffDialog.value = false
  // if(val.value.length) {
  if (val) {
    tableData.value = [...tableData.value, ...val]
    isOffDialog.value = false
  }
  // }
}
const tableData = ref([])
</script>
<style lang="scss" scoped>
.detail-wrap {
}
</style>
